<template>
	<view class="index">
		<!-- 家长端 -->

		<view class="tabbar" v-if="indexType === 1">
			<view
				class="tabbar-item"
				v-for="(item, index) in tabBar.listOne"
				@click="changeHander(item, index)"
				:key="index"
			>
				<view class="tabbar-img">
					<image :src="index == select ? item.selectedIconPath : item.iconPath" mode=""></image>
				</view>
				<view class="tabbar-text" :class="index == select ? 'active' : ''">{{ item.text }}</view>
			</view>
		</view>

		<!-- 配送端 -->

		<view class="tabbar" v-if="indexType === 2">
			<view
				class="tabbar-item"
				v-for="(item, index) in tabBar.listTwo"
				@click="changeHander(item, index)"
				:key="index"
			>
				<view class="tabbar-img">
					<image :src="index == select ? item.selectedIconPath : item.iconPath" mode=""></image>
				</view>
				<view class="tabbar-text" :class="index == select ? 'active' : ''">{{ item.text }}</view>
			</view>
		</view>

		<!-- 代理端 -->

		<view class="tabbar" v-if="indexType === 3">
			<view
				class="tabbar-item"
				v-for="(item, index) in tabBar.listThree"
				@click="changeHander(item, index)"
				:key="index"
			>
				<view class="tabbar-img z-999">
					<image :src="index == select ? item.selectedIconPath : item.iconPath"></image>
				</view>
				<view class="tabbar-text" :class="index == select ? 'active' : ''">{{ item.text }}</view>
			</view>
		</view>

		<!-- 合伙人端 -->
		<view class="tabbar" v-if="indexType === 4">
			<view
				class="tabbar-item"
				v-for="(item, index) in tabBar.listFour"
				@click="changeHander(item, index)"
				:key="index"
			>
				<view class="tabbar-img z-999">
					<image :src="index == select ? item.selectedIconPath : item.iconPath"></image>
				</view>
				<view class="tabbar-text" :class="index == select ? 'active' : ''">{{ item.text }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'tabbar',
	props: ['select'],
	data() {
		return {
			indexType: uni.getStorageSync('indexType'),
			tabBar: {
				listOne: [
					{
						pagePath: '/pages/index/index',
						iconPath: '/static/tabbar/client/index.png',
						selectedIconPath: '/static/tabbar/client/index_select.png',
						text: '首页'
					},
					{
						pagePath: '/pages/add/add',
						iconPath: '/static/tabbar/client/add.png',
						selectedIconPath: '/static/tabbar/client/add_select.png',
						text: '充值'
					},
					{
						pagePath: '/pages/mine/mine',
						iconPath: '/static/tabbar/client/mine.png',
						selectedIconPath: '/static/tabbar/client/mine_select.png',
						text: '我的'
					}
				],
				listTwo: [
					{
						pagePath: '/pagesA/order/order',
						iconPath: '/static/tabbar/master/order.png',
						selectedIconPath: '/static/tabbar/master/order_select.png',
						text: '订单'
					},
					{
						pagePath: '/pagesA/apply/apply',
						iconPath: '/static/tabbar/master/apply.png',
						selectedIconPath: '/static/tabbar/master/apply_select.png',
						text: '数量申报'
					},
					{
						pagePath: '/pagesA/message/message',
						iconPath: '/static/tabbar/master/message.png',
						selectedIconPath: '/static/tabbar/master/message_select.png',
						text: '订购信息'
					},
					{
						pagePath: '/pagesA/my/my',
						iconPath: '/static/tabbar/master/my.png',
						selectedIconPath: '/static/tabbar/master/my_select.png',
						text: '个人中心'
					}
				],
				listThree: [
					{
						pagePath: '/pagesB/index/index',
						iconPath: '/static/tabbar/agent/index.png',
						selectedIconPath: '/static/tabbar/agent/index_select.png',
						text: '首页'
					},
					{
						pagePath: '/pagesB/examine/examine',
						iconPath: '/static/tabbar/agent/shenhe.png',
						selectedIconPath: '/static/tabbar/agent/shenhe_select.png',
						text: '审核'
					},
					{
						pagePath: '/pagesB/my/my',
						iconPath: '/static/tabbar/agent/my.png',
						selectedIconPath: '/static/tabbar/agent/my_select.png',
						text: '我的'
					}
				],

				listFour: [
					{
						pagePath: '/pagesC/index/index',
						iconPath: '/static/tabbar/partner/index.png',
						selectedIconPath: '/static/tabbar/partner/index_select.png',
						text: '首页'
					},
					{
						pagePath: '/pagesC/shenhe/shenhe',
						iconPath: '/static/tabbar/partner/shenhe.png',
						selectedIconPath: '/static/tabbar/partner/shenhe_select.png',
						text: '报备'
					}
				]
			}
		};
	},
	methods: {
		changeHander(item, index) {
			if (this.select === index) {
				return;
			} else {
				//#ifdef H5
				uni.reLaunch({
					url: item.pagePath
				});
				//#endif
				//#ifdef MP-WEIXIN
				uni.reLaunch({
					url: item.pagePath
				});
				//#endif
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.index {
	position: fixed;
	bottom: 0;
	width: 100%;
}
.tabbar {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	z-index: 999;
	.tabbar-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		flex: 1;
		.tabbar-img {
			image {
				width: 60rpx;
				height: 60rpx;
			}
		}
	}
}
.active {
	color: #4151db;
}
</style>
